import React from "react"
import styles from "@/assets/css/user.module.css"
import Menu from "@/views/common/menu"

export default () => {

    // 邮箱认证
    const Email = () => {
        if(React.business.auth == '0')
        {
            return (
                <div className={styles.item}>
                    <NavLink to="/business/email" >
                        <div className={styles.title}>
                            <img src={require('@/assets/images/email.png')} alt="" style={{marginRight: '5px'}}/>
                            邮箱认证
                        </div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>
            )
        } else
        {
            return (<></>)
        }
    }

    // 退出登录
    const Logout = () => {
        React.UI.Dialog.confirm({
            title: '退出提醒',
            content: '是否确认退出登录',
            onConfirm: () => {
                // 删除cookie
                React.cookies.remove('business', {path: '/'})
                React.business = {}

                // 跳转到登录界面
                React.toast('退出成功', 'success', '/business/login')
                return false
            }
        }).catch(() => {})
    }

    return (
        <>
            <div className={styles.header}>
                <div className={styles.userinfo}>
                    <div className={styles.avatar}>
                        <img src={React.business.avatar_text} alt="" />
                    </div>
                    <div className={styles.nickname}>{React.business.nickname}</div>
                </div>
            </div>

            <div className={styles.menu_cell}>
                <div className={styles.item}>
                    <NavLink to="/business/profile" className={styles.firstA}>
                        <div className={styles.title}>
                            <img src={require('@/assets/images/profile.png')} alt="" style={{marginRight: '5px'}}/>
                            个人资料
                        </div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>

                <Email />

                <div className={styles.item}>
                    <NavLink to="/guest" className={styles.threeA}>
                        <div className={styles.title}>
                            <img src={require('@/assets/images/guest.png')} alt="" style={{marginRight: '5px'}}/>
                            住客信息
                        </div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>

                <div className={styles.item}>
                    <NavLink to="/order" >
                        <div className={styles.title}>
                            <img src={require('@/assets/images/order.png')} alt="" style={{marginRight: '5px'}} />
                            房间订单
                        </div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>
                <div className={styles.item}>
                    <NavLink to="/business/coupon" >
                        <div className={styles.title}>
                            <img src={require('@/assets/images/coupon.jpg')} alt="" style={{marginRight: '5px'}}/>
                            我的优惠券
                        </div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>
                <div className={styles.item}>
                    <NavLink to="/business/about" >
                        <div className={styles.title}>
                            <img src={require('@/assets/images/us.png')} alt="" style={{marginRight: '5px'}}/>
                            关于我们
                        </div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </NavLink>
                </div>
                <div className={styles.item} onClick={Logout}>
                    <a className={styles.lastA}>
                        <div className={styles.title}>
                            <img src={require('@/assets/images/return.png')} alt="" style={{marginRight: '5px'}}/>
                            退出登陆
                        </div>
                        <div className={styles.icon}>
                            <img src={require('@/assets/images/right.png')} alt="" />
                        </div>
                    </a>
                </div>
            </div>

            <div className={styles.footer}>
                <Menu />
            </div>
        </>
    )
}